<template>
    <div class="m-login">
        <div class="login-form">
            <div class="logo">
                <img src="../img/logo.png" alt="">
            </div>
            <div class="kuang">
             <el-form ref="form" :model="form">
            <el-form-item>
            <el-input v-model="form.name" prefix-icon="iconfont icon-user" placeholder="admin"></el-input>
            </el-form-item>
            <el-form-item>
            <el-input v-model="form.name1" prefix-icon="iconfont icon-3702mima" type="password"></el-input>
            </el-form-item>
             <el-form-item class="but">
                <el-button type="primary">deng</el-button>
                <el-button type="info">信息按钮</el-button>
             </el-form-item>
             </el-form>
            </div>
        </div>
    </div>
</template>
<script>
 export default {
    data() {
      return {
        form: {
        name1:'',
          name: '',
          region: '',
          date1: '',
          date2: '',
          delivery: false,
          type: [],
          resource: '',
          desc: ''
        }
      }
    },
    methods: {
      onSubmit() {
        console.log('submit!');
      }
    }
  }
</script>
<style lang='less' scoped>
html{
    height: 100%;
}
.m-login{
    position: relative;
    height: 100%;
    background-color: #2B4B6B;
    .login-form{
        left: 50%;
        top: 50%;
        position: absolute;
        transform: translate(-50%,-50%);
        width: 450px;
        height: 300px;
        background-color: #fff;
        border-radius: 10px;
        box-shadow: 0 0 10 rgba(255,255,255,5);
        position: relative;
        
        .logo{
            position: absolute;
            left: 50%;
            transform: translate(-50%,-50%);
            width: 152px;
            height: 152px;
            border: 10px solid #fff;
            padding: 10px;
            box-shadow: 0 0 10 rgba(255,255,255,5);
            background-color: antiquewhite;
            border-radius: 50%;
            img{
                border-radius: 50%;
            }
        }
        .kuang{
           position: absolute;
           bottom: 0;
           width: 100%;
           padding: 0 20px 0 20px;
           .but{
               text-align: right;
           }
        }
               
    }
}

</style>